<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:cote="http://java.sun.com/jsf/composite/componentes" xmlns:c="http://java.sun.com/jsp/jstl/core">


    <script type="text/javascript">
        function limpiarForm() {
            document.getElementById("formulario").reset();
        }
    </script>

    <ui:composition template="/plantillas/plantillaPrincipal.xhtml">
        <ui:define name="contenido">
            <f:view>
                <h:form id="formulario">


                    <p:panel header="REGISTRO DE DOCUMENTO" style="width: 100%;margin: 10px auto">  

                        <p:panelGrid id="formSustentoMovimiento" style="width: 100%;margin: 10px auto" 
                                     rendered="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.estadoMovimiento eq 'A'}" >

                            <p:row>
                                <p:column>
                                    <h:outputLabel id="lblRazonSocial" value="RAZON SOCIAL/NOMBRE(*):" styleClass="lblForm" />
                                </p:column>	                            
                                <p:column colspan="2">
                                    <p:inputText id="txtRazonSocial" value="#{BKDocumentoSustentador.docSustentadorFormulario.razonSocial}" 
                                                 style="width: 100%" onkeyup="cambiarMayuscula(this)" />
                                    <p:message for="txtRazonSocial" display="text" />
                                </p:column>     
                                <p:column>
                                    <cote:componenteFindProveedor id="findProveedor" 
                                                                  lblbtnfind="BUSCAR PROVEEDOR"                                                                                                      
                                                                  update=":formulario:txtRazonSocial :formulario:txtRucDni"/>

                                </p:column>

                            </p:row>   
                            <p:row>
                                <p:column>
                                    <h:outputLabel id="lblRucDni" value="RUC/DNI:" styleClass="lblForm" />
                                </p:column>	                            
                                <p:column>
                                    <p:inputText id="txtRucDni" value="#{BKDocumentoSustentador.docSustentadorFormulario.ruc}" 
                                                 style="width: 100%" onkeyup="cambiarMayuscula(this)"/>
                                </p:column>    
                            </p:row>   

                            <p:row>
                                <p:column colspan="4">
                                    <p:fieldset legend="Datos del Documento">
                                        <p:panelGrid>
                                            <p:row>
                                                <p:column style="width:180px">
                                                    <h:outputLabel id="lblTipoDocumento" value="TIPO DE DOCUMENTO(*): " styleClass="lblForm" />
                                                </p:column>

                                                <p:column style="width:220px">
                                                    <p:selectOneMenu id="cbxTipoDocumento" style="width: 180px" editable="true" required="true" 
                                                                     value="#{BKDocumentoSustentador.docSustentadorFormulario.tipoDocumento}">

                                                        <f:selectItem itemLabel="SELECCIONAR" itemValue="" />
                                                        <f:selectItem itemLabel="VALE" itemValue="VALE" />
                                                        <f:selectItem itemLabel="TICKET" itemValue="TICKET" />  
                                                        <f:selectItem itemLabel="BOLETA" itemValue="BOLETA" />
                                                        <f:selectItem itemLabel="FACTURA" itemValue="FACTURA" />  

                                                    </p:selectOneMenu>
                                                    <p:message for="cbxTipoDocumento" display="text" />
                                                </p:column>                                                                       

                                                <p:column style="width:180px">
                                                    <h:outputLabel id="lblNumeroDocumento" value="Nº DE DOCUMENTO(*):" styleClass="lblForm" />
                                                </p:column>

                                                <p:column style="width:220px">
                                                    <p:inputText id="txtNumeroDocumento" value="#{BKDocumentoSustentador.docSustentadorFormulario.numDocumento}" 
                                                                 style="width: 180px" onkeyup="cambiarMayuscula(this)" />
                                                    <p:message for="txtNumeroDocumento" display="text" />
                                                </p:column> 


                                            </p:row>      

                                            <p:row>
                                                <p:column>
                                                    <h:outputLabel id="lblConcepto" value="CONCEPTO(*): " styleClass="lblForm" />
                                                </p:column> 
                                                <p:column>                                       
                                                    <p:inputTextarea id="txtConcepto"  required="true" rows="3" style="width: 100%"
                                                                     value="#{BKDocumentoSustentador.docSustentadorFormulario.concepto}"/> 
                                                    <p:message for="txtConcepto" display="text" />

                                                </p:column> 
                                                <p:column >
                                                    <h:outputLabel id="lblFecEmisionRuc" value="FECHA DE EMISION: " styleClass="lblForm" />
                                                </p:column> 
                                                <p:column >
                                                    <p:calendar id="calendarFechaEmision" value="#{BKDocumentoSustentador.docSustentadorFormulario.fecEmisionRuc}" 
                                                                pattern="dd/MM/yyyy"
                                                                showOn="button" showButtonPanel="true" navigator="true" size="20" locale="es">
                                                    </p:calendar>
                                                </p:column>                                 
                                            </p:row>

                                            <p:row>
                                                <p:column>
                                                    <h:outputLabel id="lblMoneda" value="MONEDA(*): " styleClass="lblForm" />
                                                </p:column>

                                                <p:column>
                                                    <p:selectOneMenu id="cbxMoneda" style="width: 180px" required="true"
                                                                     value="#{BKDocumentoSustentador.docSustentadorFormulario.moneda.id}">
                                                        <f:selectItem itemLabel="SELECCIONAR" itemValue="" />
                                                        <f:selectItems value="#{BKDocumentoSustentador.listaMonedas}" var="moneda"
                                                                       itemLabel="#{moneda.nombre}" itemValue="#{moneda.id}" />  

                                                        <p:ajax update="txtTipoCambio,txtMonto" process="@this" listener="#{MBMovimientoCuentaBancaria.cambiarMoneda}" />  
                                                    </p:selectOneMenu>
                                                    <p:message for="cbxMoneda" display="text" />
                                                </p:column>
                                                <p:column>
                                                    <h:outputLabel id="lblMontoFactura" value="MONTO(*): " styleClass="lblForm" />
                                                </p:column>	                            
                                                <p:column>
                                                    <p:inputText id="txtMontoFactura" value="#{BKDocumentoSustentador.docSustentadorFormulario.montoDocumento}" 
                                                                 style="width: 100%" required="true" >
                                                        <f:convertNumber maxFractionDigits="2" minFractionDigits="2"  />
                                                        <p:ajax event="blur" process="@this" update="txtMonto" listener="#{MBMovimientoCuentaBancaria.obtenerMontoTotal}" />
                                                    </p:inputText>
                                                    <p:message for="txtMontoFactura" display="text" />
                                                </p:column>

                                            </p:row>

                                        </p:panelGrid>
                                    </p:fieldset>
                                </p:column>
                            </p:row>

                            <p:row>

                                <p:column>
                                    <h:outputLabel id="lblTipoCambio" value="TIPO DE CAMBIO: " styleClass="lblForm" />
                                </p:column>

                                <p:column>
                                    <p:inputText id="txtTipoCambio" value="#{BKDocumentoSustentador.docSustentadorFormulario.tipoCambio}" 
                                                 style="width: 180px" disabled="#{BKDocumentoSustentador.docSustentadorFormulario.moneda.id 
                                                                                  eq BKMovCtaBancaria.seleccionarMovCtaBancaria.idCuentaBancaria.idTipoMoneda.id}">
                                        <p:ajax event="blur" process="@this" update="txtMonto" listener="#{MBMovimientoCuentaBancaria.obtenerMontoTotal}" />
                                    </p:inputText>
                                </p:column>    
                                <p:column>
                                    <h:outputLabel id="lblMonto" value="MONTO CONSUMIDO: " styleClass="lblForm" />
                                </p:column>	                            
                                <p:column>
                                    <h:outputLabel id="txtMonto" value="#{BKDocumentoSustentador.docSustentadorFormulario.total}" >
                                        <f:convertNumber maxFractionDigits="2" minFractionDigits="2"  />
                                    </h:outputLabel>
                                </p:column>
                            </p:row>

                            <p:row>  


                                <p:column>
                                    <h:outputLabel id="lblFechaSustentacion" value="FECHA DE SUSTENTACION(*): " styleClass="lblForm" />
                                </p:column>       

                                <p:column>
                                    <p:calendar id="calendarFechaSustentacion" value="#{BKDocumentoSustentador.docSustentadorFormulario.fechaSustentacion}" 
                                                pattern="dd/MM/yyyy" required="true" mindate="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.fechaMovimiento}"
                                                showOn="button" showButtonPanel="true" navigator="true" size="20" locale="es">
                                        <p:ajax event="dateSelect"/>
                                    </p:calendar>
                                    <p:message for="calendarFechaSustentacion" display="text"/>
                                </p:column>    

                                <p:column>
                                    <h:outputLabel id="lblObservacion" value="OBSERVACION: " styleClass="lblForm" />
                                </p:column> 
                                <p:column>                                       
                                    <p:inputTextarea id="txtDescripcion"  required="false" rows="4" cols="30" 
                                                     value="#{BKDocumentoSustentador.docSustentadorFormulario.observacion}"/>     

                                </p:column>                                    
                            </p:row>

                            <p:row>                    
                                <p:column colspan="4">
                                    <p:commandButton id="btnAgregarDocumentoSustentatorio" actionListener="#{MBMovimientoCuentaBancaria.guardarDocumentoSustentador()}"  
                                                     icon="ui-icon-plus" value="AGREGAR DOCUMENTO" disabled="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.estadoMovimiento eq 'C'}"
                                                     update="dataTablaDocumentoSustento,lblSaldoAjax,formSustentoMovimiento,btnCerrarMovimiento2" 
                                                     ajax="true">                                                                                                                                                                                  
                                    </p:commandButton>
                                </p:column>
                            </p:row>

                            <p:row>                    
                                <p:column colspan="4">
                                    <p:separator />  
                                </p:column>
                            </p:row>

                            <p:row>                       
                                <p:column style="text-align:left">
                                    <h:outputText value="POR RENDIR: " styleClass="lblForm"/>          

                                </p:column>
                                <p:column style="text-align:center" >
                                    <h:outputText value="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.idCuentaBancaria.idTipoMoneda.simbolo}" />
                                    <h:outputText id="lblSaldoAjax" value="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.saldo}">
                                        <f:convertNumber maxFractionDigits="2" minFractionDigits="2"  groupingUsed="false"/>
                                    </h:outputText>

                                </p:column>           
                            </p:row>	
                        </p:panelGrid>                                     

                        <p:fieldset id="pnlListarDocSustentadores" legend="DOCUMENTOS QUE SUSTENTAN EL MOVIMIENTO" >
                            <p:dataTable id="dataTablaDocumentoSustento" var="documentoSustento" rendered="true"
                                         value="#{BKDocumentoSustentador.listaTodosDocumentosSustentadores}"
                                         emptyMessage="No se encontraron documentos sustentatorios disponibles"
                                         filteredValue="" rowIndexVar="rowIndex" paginator="true" rows="10"
                                         paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} 
                                         {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                                         rowsPerPageTemplate="10,20,40" paginatorPosition="bottom" styleClass="datable-busqueda"> 

                                <p:column id="idColumnaNum" style="width: 2%" headerText="Item">
                                    <h:outputText value="#{rowIndex+1}" />
                                </p:column>

                                <p:column id="idColumnaTipoDocumento" style="width: 13%;" sortBy="#{documentoSustento.tipoDocumento}" 
                                          headerText="TIPO DOC.">
                                    <h:outputText value="#{documentoSustento.tipoDocumento}" />
                                </p:column>

                                <p:column id="idColumnaRucDni" style="width: 10%;"
                                          sortBy="#{documentoSustento.razonSocial}" headerText="RAZON/NOMBRE">
                                    <h:outputText value="#{documentoSustento.razonSocial}" />
                                </p:column>

                                <p:column id="idColumnaNroDocumento" style="width: 10%;" headerText="Nº DOCUMENTO">
                                    <h:outputText value="#{documentoSustento.numDocumento}" />
                                </p:column>                               

                                <p:column id="idColumnaMonto" style="width: 10%;"
                                          sortBy="#{documentoSustento.montoDocumento}" headerText="MONTO DOC">
                                    <h:outputText value="#{documentoSustento.montoDocumento}">
                                        <f:convertNumber maxFractionDigits="2" minFractionDigits="2"  groupingUsed="false"  />
                                    </h:outputText>
                                </p:column>

                                <p:column id="idColumnaMoneda" style="width: 10%;text-align: center"
                                          sortBy="#{documentoSustento.moneda.nombre}" 
                                          headerText="MONEDA">
                                    <h:outputText value="#{documentoSustento.moneda.nombre}" />
                                </p:column>

                                <p:column id="idColumnaTotal" style="width: 10%;"
                                          sortBy="#{documentoSustento.total}" headerText="MONTO S/">
                                    <h:outputText value="#{documentoSustento.total}">
                                        <f:convertNumber maxFractionDigits="2" minFractionDigits="2"  groupingUsed="false"  />
                                    </h:outputText>
                                </p:column>

                                <p:column id="idColumnaFechaConsumo" style="width: 10%;text-align: center"
                                          sortBy="#{documentoSustento.fechaSustentacion}" headerText="FECHA SUSTENTO">
                                    <h:outputText value="#{documentoSustento.fechaSustentacion}">
                                        <f:convertDateTime pattern="dd/MM/yyyy" />
                                    </h:outputText>
                                </p:column>

                                <p:column id="idColumnaObservacion" style="width: 15%" headerText="CONCEPTO">
                                    <h:outputText value="#{documentoSustento.concepto}" />
                                </p:column>                                

                                <p:column id="idAccionesDocumentoSustentador" headerText="#{message['general.label.tipoAcesso']}" exportable="false"
                                          style="width: 10%">
                                    <center> 
                                        <p:commandButton id="btnEliminarDocumentoSustentatorio" 
                                                         title="#{message['general.button.eliminar']}" value="Eliminar" process="@this"                                                    
                                                         oncomplete="confirmacion.show()" disabled="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.estadoMovimiento eq 'C'}"
                                                         icon="ui-icon-trash" >
                                            <f:setPropertyActionListener value="#{documentoSustento}" target="#{BKDocumentoSustentador.docSustentadorSeleccionado}"/>
                                        </p:commandButton>
                                    </center>
                                </p:column>

                            </p:dataTable>                                    
                        </p:fieldset> 

                    </p:panel>
                    <center>                
                        <h:panelGrid columns="3" cellpadding="10">

                            <p:commandButton id="btnCerrarMovimiento2" oncomplete="#{BKDocumentoSustentador.listaTodosDocumentosSustentadores.size() eq 0?'confMov.show()':'confCerrarMov.show()'}"
                                             value="Cerrar Movimiento"  title="Cerrar Movimiento" 
                                             rendered="#{BKMovCtaBancaria.seleccionarMovCtaBancaria.estadoMovimiento eq 'A'}"/>

                            <p:commandButton id="btnCancelar" action="#{MBMovimientoCuentaBancaria.cancelarSustentoMovimiento}" ajax="false" 
                                             value="Regresar" title="#{message['general.button.cancelar']}"  immediate="true"/>

                        </h:panelGrid>                  
                    </center> 

                    <h:panelGrid styleClass="mensaje_obligatorio">(*) Campos Requeridos</h:panelGrid>

                    <p:confirmDialog id="dlgEliminarDocSustentador" message="¿Esta seguro que desea eliminar el documento?" 
                                     header="#{message['dialog.confirmacion.header']}" severity="alert" widgetVar="confirmacion">

                        <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px" columns="2">
                            <p:commandButton id="btnConfEliDocSustentador"  value="Si" update="dataTablaDocumentoSustento,lblSaldoAjax,btnCerrarMovimiento2" oncomplete="confirmacion.hide()"
                                             actionListener="#{MBMovimientoCuentaBancaria.eliminarDocumentoSustentador}" ajax="true" process="@this">                                            

                            </p:commandButton>

                            <p:commandButton id="btnCancEliDocSustentador" value="No" 
                                             onclick="confirmacion.hide()">                                          
                            </p:commandButton>
                        </h:panelGrid>

                    </p:confirmDialog>

                    <p:confirmDialog id="dlgCerrarMovmiento" message="El movimiento no presenta ningun documento que lo sustente. ¿ Desea cerrar de todas formas ?" 
                                     header="Cerrar Movimiento" severity="alert" widgetVar="confMov">

                        <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px" columns="2">
                            <p:commandButton id="btnConfCerrarMov" value="Si" oncomplete="confMov.hide()" immediate="true"
                                             actionListener="#{MBMovimientoCuentaBancaria.cerrarMovimiento()}" ajax="false"/>                                                                                                     

                            <p:commandButton id="btnCancCerrarMov" value="No" 
                                             onclick="confMov.hide()">                                          
                            </p:commandButton>
                        </h:panelGrid>

                    </p:confirmDialog>

                    <p:confirmDialog id="dlgCerrarMovmiento2" message="¿Esta seguro de cerrar el movimiento?" 
                                     header="Cerrar Movimiento" severity="alert" widgetVar="confCerrarMov">

                        <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px" columns="2">
                            <p:commandButton id="btnConfCerrarMov2" value="Si" oncomplete="confCerrarMov.hide()" immediate="true"
                                             actionListener="#{MBMovimientoCuentaBancaria.cerrarMovimiento()}" ajax="false"/>                                                                                                       

                            <p:commandButton id="btnCancCerrarMov2" value="No" 
                                             onclick="confCerrarMov.hide()">                                          
                            </p:commandButton>
                        </h:panelGrid>

                    </p:confirmDialog>

                </h:form> 
            </f:view>      
        </ui:define>
    </ui:composition>
</html>
